import React, { useState } from 'react';
import BraftEditor from 'braft-editor';
import 'braft-editor/dist/index.css';


export default function TextEditor({ data, onChangeValue }) {
  // const [editorState, setEditorState] = useState();
  const [editorState, setEditorState] = useState(BraftEditor.createEditorState(data));

  let timer =null
  const handleChange = (editorState) => {
    clearTimeout(timer);
    timer = setTimeout(()=>{
      setEditorState(editorState);
      onChangeValue(editorState.toHTML());
    },500)
  };

  return (
    <div className='textEditor'>
      <BraftEditor
        value={editorState}
        onChange={handleChange}
      />
    </div>
  );
};